<ui:composition template="master.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui">

    <ui:define name="title">
        Registreren
    </ui:define>

    <ui:define name="content">
        <p>
            Als u zich wenst te registreren, vul onderstaande velden met uw informatieve gegevens volledig en correct in.  Alle gegevens worden confidentieel opgeslagen en bewaard. 
        </p>
        <table>
            <h:form>
                <tr>
                    <td><h:outputLabel id="naamLabel" for="naam" value="Naam:  " /></td>
                    <td>
                        <p:inputText id="naam" value="#{controllerRegistreren.klant.naam}" validatorMessage="Er is geen naam ingegeven!">
                            <f:validateLength minimum="2" /> 
                            <f:validateRequired /> 
                        </p:inputText>
                    </td>
                    <td><p:message for="naam" /></td>
                </tr>
                <tr>
                    <td><h:outputLabel id="achternaamLabel" for="achternaam" value="Achternaam:  " /></td>
                    <td>
                        <p:inputText id="achternaam" value="#{controllerRegistreren.klant.achternaam}" validatorMessage="Er is geen achternaam ingegeven!">
                            <f:validateLength minimum="2" /> 
                            <f:validateRequired /> 
                        </p:inputText>
                    </td>
                    <td><p:message for="achternaam" /></td>
                </tr>
                <tr>
                    <td><h:outputLabel id="emailLabel" for="email" value="Email:  " /></td>
                    <td>
                        <p:inputText id="email" value="#{controllerRegistreren.klant.email}"  validatorMessage="Er is geen email ingegeven of de het wordt niet als een email adres herkent!">
                            <f:validateLength minimum="2" /> 
                            <f:validateRegex pattern="[\w\.-]*[a-zA-Z0-9_]@[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]*[a-zA-Z]" />
                            <f:validateRequired />   
                        </p:inputText>
                    </td>
                    <td><p:message for="email" /></td>
                </tr>
                <tr>
                    <td><h:outputLabel id="paswoordLabel" for="naam" value="Paswoord:  " /></td>
                    <td>
                        <p:password id="paswoord" validatorMessage="Er is een ongeldig wachtwoord opgegeven."  value="#{controllerRegistreren.klant.wachtwoord}" match="paswoord2" label="paswoord"> 
                        <f:validateLength minimum="2" /> 
                        <f:validateLength maximum="20" /> 
                        <f:validateRequired />   
                        </p:password>
                    </td>
                    <td><p:message for="paswoord" /></td>
                </tr>
                <tr>
                    <td><h:outputLabel id="paswoord2Label" for="naam" value="Herhaal paswoord:  " /></td>
                    <td>
                        <p:password id="paswoord2" validatorMessage="Er is een ongeldig wachtwoord opgegeven."  value="#{controllerRegistreren.paswoord2}" label="paswoord2">
                            <f:validateLength minimum="2" />
                            <f:validateLength maximum="20" /> 
                            <f:validateRequired />   
                        </p:password>
                    </td>
                    <td><p:message for="paswoord2" /></td>
                </tr>
                <tr>
                    <td colspan="3"><h:commandButton value="Registreren" action="#{controllerRegistreren.insertKlant()}" /></td>
                </tr> 
            </h:form>
        </table>
        
        <h:outputText value="#{controllerRegistreren.foutmelding}" rendered="#{controllerRegistreren.foutmelding != null}"/>
        <br />
    </ui:define>  
</ui:composition>